{% extends "base.html" %}

{% block title %}学生个人主页 - 学生管理系统{% endblock %}

{% block content %}
<div class="container mt-4">
    <div class="row">
        <div class="col-md-4">
            <!-- 学生信息卡片 -->
            <div class="card mb-4">
                <div class="card-header bg-primary text-white">
                    <h5 class="mb-0">
                        <i class="fas fa-user-graduate me-2"></i>个人信息
                    </h5>
                </div>
                <div class="card-body">
                    <div class="text-center mb-3">
                        <i class="fas fa-user-circle fa-5x text-primary"></i>
                    </div>
                    <h4 class="text-center">{{ session.get('name', '学生') }}</h4>
                    <p class="text-center text-muted">学号: {{ session.get('username', '') }}</p>
                    
                    <div class="mt-3">
                        <div class="d-flex justify-content-between">
                            <strong>用户类型:</strong>
                            <span class="badge bg-success">学生</span>
                        </div>
                    </div>
                </div>
            </div>

            <!-- 快捷功能 -->
            <div class="card">
                <div class="card-header bg-info text-white">
                    <h6 class="mb-0">
                        <i class="fas fa-rocket me-2"></i>快捷功能
                    </h6>
                </div>
                <div class="card-body">
                    <div class="d-grid gap-2">
                        <a href="/selection" class="btn btn-outline-primary">
                            <i class="fas fa-tasks me-2"></i>选课中心
                        </a>
                        <a href="/my-courses" class="btn btn-outline-success">
                            <i class="fas fa-book me-2"></i>我的课程
                        </a>
                        <a href="/change-password" class="btn btn-outline-warning">
                            <i class="fas fa-key me-2"></i>修改密码
                        </a>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-md-8">
            <!-- 欢迎信息 -->
            <div class="card mb-4">
                <div class="card-body text-center">
                    <h3>欢迎回来，{{ session.get('name', '同学') }}！</h3>
                    <p class="text-muted">学生管理系统为您提供便捷的选课和学习管理服务</p>
                </div>
            </div>

            <!-- 功能模块 -->
            <div class="row">
                <div class="col-md-6 mb-4">
                    <div class="card h-100">
                        <div class="card-body text-center">
                            <i class="fas fa-tasks fa-3x text-primary mb-3"></i>
                            <h5>选课管理</h5>
                            <p class="text-muted">浏览和选择感兴趣的课程</p>
                            <a href="/selection" class="btn btn-primary">进入选课</a>
                        </div>
                    </div>
                </div>

                <div class="col-md-6 mb-4">
                    <div class="card h-100">
                        <div class="card-body text-center">
                            <i class="fas fa-book fa-3x text-success mb-3"></i>
                            <h5>我的课程</h5>
                            <p class="text-muted">查看已选课程和学习进度</p>
                            <a href="/my-courses" class="btn btn-success">查看课程</a>
                        </div>
                    </div>
                </div>

                <div class="col-md-6 mb-4">
                    <div class="card h-100">
                        <div class="card-body text-center">
                            <i class="fas fa-key fa-3x text-warning mb-3"></i>
                            <h5>账户安全</h5>
                            <p class="text-muted">修改登录密码保护账户安全</p>
                            <a href="/change-password" class="btn btn-warning">修改密码</a>
                        </div>
                    </div>
                </div>

                <div class="col-md-6 mb-4">
                    <div class="card h-100">
                        <div class="card-body text-center">
                            <i class="fas fa-chart-bar fa-3x text-info mb-3"></i>
                            <h5>学习统计</h5>
                            <p class="text-muted">查看学习进度和成绩统计</p>
                            <a href="/statistics" class="btn btn-info">查看统计</a>
                        </div>
                    </div>
                </div>
            </div>

            <!-- 系统公告 -->
            <div class="card">
                <div class="card-header bg-light">
                    <h6 class="mb-0">
                        <i class="fas fa-bullhorn me-2"></i>系统公告
                    </h6>
                </div>
                <div class="card-body">
                    <div class="alert alert-info">
                        <strong>欢迎使用学生管理系统！</strong>
                        <p>请及时完成选课，如有任何问题请联系管理员。</p>
                    </div>
                    <div class="alert alert-warning">
                        <strong>密码安全提示</strong>
                        <p>建议定期修改密码，确保账户安全。</p>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
{% endblock %}

{% block scripts %}
{{ super() }}
<script>
// 页面加载时检查用户类型
document.addEventListener('DOMContentLoaded', function() {
    const userType = '{{ session.get("user_type") }}';
    if (userType !== 'student') {
        // 如果不是学生，显示提示信息
        console.log('当前用户不是学生类型');
    }
});
</script>
{% endblock %}
